<template>
<div class="com-container" style="border-bottom: 1px solid #ccc;line-height: 60px">
  <div style="width: 30px;height: 60px;line-height:60px;display: inline-block;left: 0;position: absolute" >
    <!--控制侧边栏收缩按钮-->
    <span :class="collapseBtnclass" style="cursor: pointer;font-size: 18px" @click="collapse" ></span>
  </div>
  <el-dropdown style="position: absolute;right: 0;width: 85px">
  <span style="cursor: pointer">
    {{ user.username }}<i class="el-icon-arrow-down el-icon--right"></i>
  </span>

    <el-dropdown-menu slot="dropdown">
      <el-dropdown-item><span @click="selfInfo">个人信息</span></el-dropdown-item>
      <el-dropdown-item><span @click="logout">退出</span></el-dropdown-item>
    </el-dropdown-menu>
  </el-dropdown>
</div>
</template>

<script>
export default {
  name: "Header",
  props:['collapseBtnclass','collapse'],
  data() {
    return {
      user: localStorage.getItem("user") ? JSON.parse(localStorage.getItem("user")) : {}
    }
  },
  methods: {
    logout() {
      this.$router.push("/")
      localStorage.removeItem("user")
      this.$message.success("退出成功")
    },
    selfInfo() {
      this.$router.push("/manage/admainInfo")
    }

  }
}
</script>

<style scoped>

</style>